<template>
    <div class="page">
        <TopBar title="我的地址"></TopBar>
        <el-form ref="form" :model="form" label-width="80px" class="form">
        <el-form-item label="名字">
            <el-input v-model="form.name"></el-input>
        </el-form-item>
        <el-form-item label="手机号">
            <el-input v-model="form.mobile"></el-input>
        </el-form-item>
        <el-form-item label="详细地址">
            <el-input v-model="form.detail"></el-input>
        </el-form-item>
        <el-form-item label="是否默认">
            <el-switch
            v-model="form.defaults">
            </el-switch>
        </el-form-item>
        </el-form>
        <div class="ddd">
            <el-button class="btn" @click="addrs">确认修改</el-button>
            <el-button class="btn1" @click="del">确认删除</el-button>
        </div>
        
        
    </div>
</template>

<script>
import TopBar from "@/components/TopBar";
export default {
    name: '',
    data() {
        return {
            form:{
                aid:'',
                name:'',
                mobile:'',
                detail:'',
                defaults:false,
            },
        };
    },
    props: {},

    components: {
      TopBar
    },

    created() {},

    mounted() {
        this.Getaddr()
    },

    methods: {
        del(){
            this.$axios.delete("customer/addruser/",{
            params:{id:this.$route.query.id},
            headers:{
                'Authorization':localStorage.getItem('token') || ''
            }
            }).then(res => {
            if (res.data.code == 200 || res.data.code == 201 || res.data.code == 202) {
                this.$message.success(res.data.msg)
                this.$router.push('/location')
            }
            })
        },
        Getaddr(){
            this.$axios.get("customer/addruser/" + this.$route.query.id + '/',{
            headers:{
                'Authorization':localStorage.getItem('token') || ''
            }
            }).then(res => {
            if (res.data.code == 200 || res.data.code == 201 || res.data.code == 202) {
                this.form = res.data.data
            }
            })
        },
        addrs(){
            this.$axios.put("customer/addruser/",this.form,{
            headers:{
                'Authorization':localStorage.getItem('token') || ''
            }
            }).then(res => {
            if (res.data.code == 200 || res.data.code == 201 || res.data.code == 202) {
                this.$message.success(res.data.msg)
            }
            })
        }
    },

    computed: {},

    watch: {},

    directives: {},

    filters: {}
};
</script>

<style scoped>
.ddd{
    margin-left: 25%;
}
 .page {
    background-color: rgb(242, 242, 242);
    min-height: 100vh;
  }
  .btn{
  background-color:rgb(137, 241, 255);
  border: none;
  color: #000000;
  border-radius: 20px;
}
.btn1{
  background-color:rgb(255, 90, 90);
  border: none;
  color: #000000;
  border-radius: 20px;
}
.form{
    margin-right: 20px;
}
</style>
